<template>
  <div class="login">
    <div class="top">
      <img src="../assets/img/img2/v2_pyd3x3.png" alt />
    </div>
    <div id="btn">
      <router-link to="/user/login"><button class="btn1">登录</button></router-link>
      <router-link to="/user/register"><button class="btn1">注册</button></router-link>
      <!-- <router-link to="test"><button class="btn1">test</button></router-link> -->
    </div>
    

  </div>
</template>

<script>
  import { mapState, mapActions } from 'vuex'
  export default {

    methods: {
      // 如果methods里面还有其他函数，就要在辅助函数名称的前面加上扩展运算符
    },
    computed: mapState(['token', 'userPhone', 'userid']), // this.token相当于this.$store.state.token
    created() {
      if (this.token) {
        this.$router.push(
          {
            name: 'home',
          }
        )
      }
    },
  }
</script>

<style lang="scss" scoped>
  .login {
    background: url("../assets/img/img2/home.png") no-repeat center center;
    background-size: 100% 100%;
    width: 100vw;
    height: 100vh;
  }

  .top {
    padding-top: 0.8rem;
    text-align: center;
  }

  .top img {
    width: 3rem;
    height: 3rem;
    margin: 0 auto;
    max-width: 150px;
    max-height: 150px;
    margin-left: .2rem;
  }

  #btn {
    position: fixed;
    width: 100%;

    bottom: 2rem;
    display: flex;
    justify-content: space-around;

  }

  .btn1 {

    width: 2.82rem;
    height: .96rem;
    border-radius: 4px;
    background-color: #07c160;
    color: rgba(255, 255, 255, 1);
    font-size: 20px;
    text-align: center;
    font-family: Microsoft Yahei;
    border: 1px solid rgba(187, 187, 187, 1);
    max-width: 141px;
    max-height: 48px;
  }
</style>